<template>
	<div>
		<div style="display: flex;flex-direction: row;">
			<img id="img" :src="logo">
			<div id="alteraddress">
				<p style="font-size: 6px;margin-bottom:20px;">
					修 改 个 人 信 息
				</p>
			</div>
		</div>
		<div class="daohanglan">
			<div>
				<el-row class="tac">
					<el-col :span="100">
						<el-menu default-active="/display" class="el-menu-vertical-demo" background-color="#00aaff" text-color="#000000"
						active-text-color="#ffffff" :router="true">
							<el-menu-item index="/personalcenter">
								<i class="el-icon-shopping-cart-1"></i>
								<span slot="title">购物车</span>
							</el-menu-item>
							<el-menu-item index="/orders">
								<i class="el-icon-document"></i>
								<span slot="title">我的订单</span>
							</el-menu-item>
							<el-menu-item index="/display">
								<i class="el-icon-goods"></i>
								<span slot="title">我的晒物</span>
							</el-menu-item>
							<el-menu-item index="/address">
								<i class="el-icon-s-home"></i>
								<span slot="title">我的地址</span>
							</el-menu-item>
						</el-menu>
					</el-col>
				</el-row>
			</div>
			<div style="margin-left:15% ;">
				<el-row>
					<el-col :span="8" v-for="(o, index) in 2" :key="o" :offset="index > 0 ? 2 : 0">
						<el-card :body-style="{ padding: '0px' }">
							<img src="../assets/background.png" class="image">
							<div style="padding: 14px;">
								<span>好吃的汉堡</span>
								<div class="bottom clearfix">
									<time class="time">{{ currentDate }}</time>
									<el-button type="text" class="button">删除</el-button>
								</div>
							</div>
						</el-card>
					</el-col>
				</el-row>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				logo: require("../assets/logo.png"),
				headicon: require("../assets/headicon.png"),
				currentDate: new Date(),
				input: ''
			}
		},
		methods: {
			mounted() {
				this.requestUser()
			},
			requestUser(){
				var that = this
				this.$axios.post('http://localhost:8080/getbookbyid/' + this.input)
					.then(function(response) {
						console.log(response.data.data)
						alert("查询成功")
						that.tableData = response.data.data
					}).catch(function(error) {
						console.log(error)
							
					})
			},
			handleChange(value) {
				console.log(value);
			}
		}
	}
</script>

<style>
	#img {
		width: 110px;
		height: 30px;
		margin-top: 10px;
		margin-left: 10px;
		float: left;
	}

	#alteraddress {
		width: 275px;
		height: 17px;
		background-color: #ffffff;
		border-radius: 20px;
		text-align: center;
		margin-top: 20px;
		margin-left: 55px;
		border: 1px solid rgba(187, 187, 187, 100);

	}

	.daohanglan {
		margin-top: 50px;
		margin-left: 50px;
		margin-bottom: 50px;
		display: flex;
		flex-direction: row;
	}

	.time {
		font-size: 13px;
		color: #999;
	}

	.bottom {
		margin-top: 13px;
		line-height: 12px;
	}

	.button {
		padding: 0;
		float: right;
	}

	.image {
		width: 100%;
		display: block;
	}

	.clearfix:before,
	.clearfix:after {
		display: table;
		content: "";
	}

	.clearfix:after {
		clear: both
	}
</style>
